<%@ page contentType="text/html;charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/common/taglibs.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>

<title>数据字典列表</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<link rel="shortcut icon" href="${ctx }/ico/favicon.ico">
<link href="${ctx }/css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
<link href="${ctx }/css/font-awesome.css?v=4.4.0" rel="stylesheet">

<!-- jqgrid-->
<link href="${ctx }/css/plugins/jqgrid/ui.jqgrid.css?0820"
	rel="stylesheet">

<link href="${ctx }/css/animate.css" rel="stylesheet">
<link href="${ctx }/css/common.css" rel="stylesheet">
<link href="${ctx }/css/style.css?v=4.1.0" rel="stylesheet">
<!-- Sweet Alert -->
<link href="${ctx }/css/plugins/sweetalert/sweetalert.css"
	rel="stylesheet">
<link
	href="${ctx}/css/plugins/bootstrap-select/bootstrap-select.min.css"
	rel="stylesheet" />
<!-- bootstrap-switch css -->
<link href="${ctx }/css/plugins/bootstrap-switch/bootstrap-switch.css"
	rel="stylesheet">
<style type="text/css">
body {
	background: none;
}

@media ( min-width : 950px) {
	.modal-dialog {
		width: 950px;
	}
}
</style>
</head>
<div class="inmodal" role="dialog" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content animated bounceInRight">
			<div class="modal-header">
				<button type="button" class="close closeWin" data-dismiss="modal">
					<span aria-hidden="true">&times;</span><span class="sr-only">关闭</span>
				</button>
				<h5 class="modal-title">数据项字典值</h5>
			</div>
			<div class="animated fadeInRight">
				<div class="row">
					<div class="col-sm-12">
						<div class="ibox ">
							<div class="ibox-content">
								<div class="jqGrid_wrapper">
									<table id="table_list"></table>
									<div id="pager_list"></div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div></div>
	<!-- 全局js -->
	<script src="${ctx }/js/jquery.min.js?v=2.1.4"></script>
	<script src="${ctx }/js/bootstrap.min.js?v=3.3.6"></script>

	<!-- Peity -->
	<script src="${ctx }/js/plugins/peity/jquery.peity.min.js"></script>

	<!-- jqGrid -->
	<script src="${ctx }/js/plugins/jqgrid/i18n/grid.locale-cn.js?0820"></script>
	<script src="${ctx }/js/plugins/jqgrid/jquery.jqGrid.min.js?0820"></script>

	<!-- jQuery Validation plugin javascript-->
	<script src="${ctx }/js/plugins/validate/jquery.validate.min.js"></script>
	<script src="${ctx }/js/plugins/validate/messages_zh.min.js"></script>

	<!-- layer javascript -->
	<script src="${ctx }/js/plugins/layer/layer.min.js"></script>

	<!-- jQuery form-->
	<script src="${ctx }/js/jquery.form.js"></script>
	<!-- 自定义js -->
	<script src="${ctx }/js/content.js?v=1.0.0"></script>
	<!-- Sweet alert -->
	<script src="${ctx }/js/plugins/sweetalert/sweetalert.min.js"></script>
	<script
		src="${ctx}/js/plugins/bootstrap-select/bootstrap-select.min.js"></script>
	<!-- bootstrap-switch js -->
	<script src="${ctx }/js/plugins/bootstrap-switch/bootstrap-switch.js"></script>
	<script>
		$(document)
				.ready(
						function() {
							$.jgrid.defaults.styleUI = 'Bootstrap';
							//绑定表格数据
							$("#table_list")
									.jqGrid(
											{
												url : "${ctx }/monit_dict/dictListPage?pk_item_id=${pk_item_id}",
												datatype : "json",
												//height : "calc(100% - 265px)",
												height : $(window).height() - 270,
												autowidth : true,
												shrinkToFit : false,
												multiselect : true,
												rowList : [ 10, 20, 30 ],
												root : "rows",
												colNames : [ '主键ID', '场景ID',
														'所属字典ID', '数据项ID',
														'数据项名称', '起始系统',
														'目标系统', '中文名称',
														'起始字段', '目标字段',
														'起始字段转换', '目标字段转换',
														'起始规则', '目标规则', '错误描述' ],
												colModel : [
														{
															name : 'id',
															index : 'id',
															hidden : true
														},
														{
															name : 'pk_scene_id',
															index : 'pk_scene_id',
															hidden : true
														},
														{
															name : 'pk_dict_id',
															index : 'pk_dict_id',
															hidden : true
														},
														{
															name : 'pk_item_id',
															index : 'pk_item_id',
															hidden : true
														},
														{
															name : 'item_name',
															index : 'item_name',
															width : 100
														},
														{
															name : 'initial_system',
															index : 'initial_system',
															width : 80
														},
														{
															name : 'target_system',
															index : 'target_system',
															width : 80
														},
														{
															name : 'c_field',
															index : 'c_field',
															width : 100
														},
														{
															name : 'initial_field',
															index : 'initial_field',
															width : 100
														},
														{
															name : 'targat_field',
															index : 'targat_field',
															width : 100
														},
														{
															name : 'initial_field_conversion',
															index : 'initial_field_conversion',
															width : 100
														},
														{
															name : 'target_field_conversion',
															index : 'target_field_conversion',
															width : 100
														},
														{
															name : 'initial_rule',
															index : 'initial_rule',
															width : 100
														},
														{
															name : 'target_rule',
															index : 'target_rule',
															width : 100
														},
														{
															name : 'error_description',
															index : 'error_description',
															width : 100
														} ],
												sortable : true,
												sortname : 'insert_time',
												sortorder : 'desc',
												pager : "#pager_list",
												caption : "数据字典列表",
												ondblClickRow : function(row) {
													var frameSrc = "${ctx}/monit_dict/edit_dict?id="
															+ row
															+ "&pk_scene_id=${pk_scene_id}&pk_dict_id=${pk_dict_id}";
													$("#editDictFrame").attr(
															"src", frameSrc);
													$('#editDictWin').modal(
															'show');
												},
												loadComplete : function() {
													scrollX();
												}
											});
						});
		$("#pager_list_center").css("width", "50%")
		scrollX();
		// jqGrid 自动调整宽度
		$(window).bind('resize', function() {
			var width = $('.jqGrid_wrapper').width();
			$('#table_list').setGridWidth(width);

			$(window).unbind("onresize");
			var height = $(window).height();
			$("#table_list").setGridHeight(height - 270);
			$(window).bind("onresize", this);

			scrollX();
		});

		//表格横向滚动条
		function scrollX() {
			$(".ui-jqgrid-bdiv").css("width", "100%")
			$(".ui-jqgrid-bdiv").css("overflow-x", "scroll");
			$("#pager_list").css("width", "100%");
			$("#gbox_table_list").css("width", "100%");
			$("#gview_table_list").css("width", "100%");
			$(".table-responsive").css("overflow-x", "hidden");
		}
		$('.closeWin').click(function() {
			window.parent.editWinClose('2');
		});
	</script>
	</body>
</html>